// components/verifyimg/index.js
const {
  base,
  post,
  globalData
} = getApp();
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    phone: String,
    coupon_unique_id: String,
    activity_code: String,
    hiddenflag: {
      type: Boolean,
      observer: function (newVal) {
        if (newVal) {
          console.log(this);
          this.setData({
            codeimg: `${base}silder-captcha/get-captcha-img?access_token=${globalData.access_token}&uniqueCode=${this.properties.phone}&flag=${Math.random()}`
          });
          const query = wx.createSelectorQuery().in(this)
          const that = this;
          setTimeout(function () {
            query.select('#verifyimg').boundingClientRect(function (res) {
              that.setData({
                imgLeft: res.left,
                imgTop: res.top
              })
            }).exec()
          }, 500)
        }
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    codeimg: '',
    checkNum: 4, //校对的文字数量
    checkPosArr: [], //已点击的文字位置
    checkPosStr: '', //已点击文字位置字符串连接
    num: 1, //即将点击的文字数量
    imgLeft: 0, //图片距离屏幕左边距离
    imgTop: 0 //图片距离屏幕上边位置
  },

  /**
   * 组件的方法列表
   */
  methods: {
    //重新加载图片
    reload() {
      this.setData({
        codeimg: `${base}silder-captcha/get-captcha-img?access_token=${globalData.access_token}&uniqueCode=${this.properties.phone}&flag=${Math.random()}`,
        num: 1,
        checkPosArr: [],
        checkPosStr: ''
      })
    },
    //点击图片文字
    checkEvent(e) {
      const that = this;
      let num = that.data.num + 1;
      if (that.data.num <= that.data.checkNum) {
        let pos = that.getMousePos(e)
        let checkpos = that.data.checkPosArr;
        let checkposStr = that.data.checkPosStr
        checkpos.push(pos);
        const x = pos.x - parseInt(e.currentTarget.offsetLeft)
        const y = pos.y - parseInt(e.currentTarget.offsetTop)
        if (checkposStr != "") {
          checkposStr = checkposStr + ";" + x + ":" + y;
        } else {
          checkposStr = x + ":" + y;
        }
        that.setData({
          checkPosArr: checkpos,
          checkPosStr: checkposStr,
          num: num
        })
      }
      if (that.data.num == that.data.checkNum + 1) {
        that.checkResult()
      }
    },
    getMousePos(e) {
      //获取点击位置
      const x = parseInt(e.detail.x - this.data.imgLeft)
      const y = parseInt(e.detail.y - this.data.imgTop)
      return {
        'x': x,
        'y': y
      }
    },
    checkResult() {
      const that = this;
      post('/activity/receive', {
        "validateTxt": that.data.checkPosStr,
        "uniqueCode": that.properties.phone,
        "coupon_unique_id": that.properties.coupon_unique_id,
        "activity_code": that.properties.activity_code
      }).then(res => {
        if (res.result == 1) {
          wx.showToast({
            title: '领取成功',
            icon: 'none'
          })
          that.successHide();
        } else {
          wx.showToast({
            title: res.data.message,
            icon: 'none'
          })
          that.reload()
        }
      })
    },
    // 关闭
    hideTap() {
      this.triggerEvent('hideVerify')
    },
    // 发送成功关闭
    successHide() {
      this.triggerEvent('successHide')
    }
  }
})